<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
	  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
	  xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4"

>

<head>
<meta charset="UTF-8">
<title>主页面</title>
</head>
<body>
<table border="1">
	<thead>
		<tr>
			<th>序号</th>
			<th>id</th>
			<th>用户名</th>
			<th>密码</th>
			<th>操作</th>
		</tr>
	</thead>

	<tbody th:each="map,iterStat : ${listuser}">
			<tr >
				<td th:text="${iterStat.index}"></td>
				<td th:text="${map.id}"></td>
				<td th:text="${map.username}"></td>
				<td th:text="${map.pwd}"></td>
				<td>
					<button th:value="${map.id}" onclick="update(this)">修改</button>
					<button th:value="${map.id}" onclick="deletes(this)">删除</button>
				</td>
			</tr>
	</tbody>
</table>
<!--弹窗--><br><br><br><br><br><br>
<div style="display: none" id="tos">
	<form autocomplete="off">
		<input type="text" id="username" name="username"><br>
		<input type="text" id="pwd" name="pwd"><br>
		<input type="hidden" id="id" name="id"><br>
		<input type="button" id="update" value="保存修改"><br>
	</form>

</div>
<script src="js/jquery.min.js"></script>
<script>
	//修改 回填
	function update(q) {
		$("#tos").fadeIn(100);
		var id=q.value;
		$.post("/Iduser",{id:id},function (iduser) {
			$("#username").val(iduser.username);
			$("#pwd").val(iduser.pwd);
			$("#id").val(iduser.id);
		})
	}

	//保存修改
	$("#update").click(function () {
		var username=$("#username").val();
		var pwd=$("#pwd").val();
		var id=$("#id").val();
		$.post("upuser",{username:username,pwd:pwd,id:id},function (obj) {
			if(obj==1){
				alert("成功")
				location.reload();//刷新浏览器
			}else if(obj==0){
				alert("失败")
			}
		})
	})

	//删除
	function deletes(T) {
		var id=T.value;
		var t=confirm("你要删除他吗？")
        if(t==true){//@{~/loginuser}
            $.post("/deleteuser",{id:id},function (obj) {
                if(obj==1){
                    alert("成功")
                    location.reload();//刷新浏览器
                }else if(obj==0){
                    alert("失败");
                }
            })
        }

	}
</script>
</body>
</html>